<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="zh">
<head>
<title>选择物资</title>
<jsp:include page="/WEB-INF/view/commons/css.jsp" />
</head>
<body>
	<div id="main-container" class="container-fluid">
		<form action="bizMaterialsManage/dolist" name="searchInfoForm"
			id="searchInfoForm" method="post" class="form-horizontal">
			<input name="materialsType" value="" type="hidden" />
			<input name="curStatus" value="1" type="hidden" />
			<div class="row">
				<div class="col-sm-5">
					<div class="input-group">
						<input class="form-control" name="keywords"
							placeholder="请输入编号或者物资名称"> <span
							class="input-group-btn"><button id="searchInfoButton"
								type="submit" class="btn btn-primary btn-sm">查询</button></span>
					</div>
				</div>
			</div>
			<div class="row mt20">
				<div class="col-sm-3">
					<div class="selectbox">
						<ul class="select-ul">
							<li class="active" data-value="">全部分类</li>
							<c:forEach var="obj" items="${materialsTypeList}" varStatus="i">
								<li data-value="${obj.id}">${obj.typeName}</li>
							</c:forEach>
						</ul>
					</div>

				</div>
				<div class="col-sm-9">
					<table id="table_data"
						class="table table-striped table-bordered table-hover">
						<thead>
							<th class="center td-checkbox" width="5%">
								<label>
									<input id="allSelected" type="checkbox" class="all-check ace" data-tableid="table_data" />
									<span class="lbl"></span>
								</label>
							</th>
							<th>编号</th>
							<th>物资名称</th>
							<th>规格</th>
							<th>单位</th>
							<th>可出库数量</th>
							<th>系统库存</th>
						</thead>
					</table>
				</div>
			</div>
		</form>
		
	</div>
	<!--/#main-container-->

	<!-- script start -->
	<jsp:include page="/WEB-INF/view/commons/js.jsp" />
	<script type="text/javascript">
		var tableAll = 0;
		var checkedIds = "";//翻页保存选中的id
		var checkArr = [];//保存选中对象
		var flag = ""; // 0 表示不需要判断库存为0的情况，1表示需要判断库存为0的情况，库存为0，不可选择
		$(document).ready(function(e) {
			var table = $("#table_data").dataTable({
				ajax : function(data, callback, settings) {
					tableAjax($("#searchInfoForm"), data, callback, settings);
				},
				//列表表头字段
				columns : [ mainConfig.checkboxColumn, {
					"data" : "materialsCode",
					name : "materials_code",
					orderable : false
				}, {
					"data" : "materialsName",
					name : "materials_name",
					orderable : false
				}, {
					"data" : "specification",
					name : "specification",
					orderable : false
				}, {
					"data" : "unitStr",
					name : "unit",
					orderable : false
				}, {
					"data" : "enableStockNum",
					name : "enable_stock_num",
					orderable : false
				}, {
                    "data" : "stockNum",
                    name : "stock_num",
                    orderable : false
                } ],
				scrollY : "320px",
				scrollCollapse : true,
				bLengthChange : false,
				iDisplayLength : 10000,//每页显示条数
				pagingType : "numbers"
			}).api();
			tableAll = table;
			//查询条件
			$("#searchInfoForm").submit(function() {
				table.ajax.reload();
				setTimeout(function(){
					getChecked();
				},200);
				handlerCheck();
				return false;
			});

			//左侧类别点击
			$(".select-ul>li").on("click", function() {
				$(".select-ul>li").each(function() {
					$(this).removeClass("active");
				})
				$(this).addClass("active")
				$("input[name=materialsType]").val($(this).attr("data-value"));
				$("#searchInfoForm").submit();
				setTimeout(function(){
					getChecked();
				},100);
				handlerCheck();
			});
			
			handlerCheck();
			
			$('.all-check').on('click' , function(){
		        var that = this;
		        $('#'+$(this).data('tableid')).find('input:checkbox').each(function(){
		                this.checked = that.checked;
		            });
		        changeIds();
		    });
			
		});
		
		// 监听checkbox点击事件
		function handlerCheck(){
			setTimeout(function(){
				$("input[name=checkbox]").each(function(){
					$(this).click(function(){
						
						changeIds();
						//checkOne(this);
					});
				});
			},200)
		}
		
		//获取所有已经选中的行，并保存数据
		function changeIds() {
			var oneches = document.getElementsByName("checkbox");
			for (var i = 0; i < oneches.length; i++) {
					var selectLine = tableAll.data()[i];
				if (oneches[i].checked == true) {
					//避免重复累计id （不含该id时进行累加）
					if(flag == 1){ //需要 判断库存为0的情况
						if(selectLine.enableStockNum <= 0){ //如果可用库存为0
							oneches[i].checked = false;
							layer.alert(selectLine.materialsName + '不可选择');
						}else{
							if (checkedIds.indexOf(oneches[i].value) == -1) {
								checkedIds = checkedIds + oneches[i].value + ",";
								checkArr.push(selectLine);
							}
						}
					}else{
						if (checkedIds.indexOf(oneches[i].value) == -1) {
							checkedIds = checkedIds + oneches[i].value + ",";
							checkArr.push(selectLine);
						}
					}
					
				}
				if (oneches[i].checked == false) {
					//console.log(1);
					//console.log(checkArr);
					var arrObj = findObjInArr(checkArr, oneches[i].value)
					if(arrObj){
						if(arrObj.isActive == 1){
							oneches[i].checked = true;
						}else{
							//取消复选框时 含有该id时将id从全局变量中去除
							if (checkedIds.indexOf(oneches[i].value) != -1) {
								checkedIds = checkedIds.replace((oneches[i].value + ","), "");
								var selectLine = tableAll.data()[i];
								removeObjWithArr(checkArr ,selectLine );
							}
						}
					}
				}
			}
			
			//对数组进行排序
			checkArr.sort(function(a,b){
				return a.id-b.id;
				});
			//调用父页面的方法处理页面数据
			parent.changeSelectedData(checkArr);
		}

		//匹配已有数据，并选中相应行
		function getChecked() {
			var oneches = document.getElementsByName("checkbox");
			for (var i = 0; i < oneches.length; i++) {
				//全局变量中含有id，则该复选框选中
				if (checkedIds.indexOf(oneches[i].value) != -1) {
					oneches[i].checked = true;
				}
			}
		}

        function inputDataHandle(msg, index){
        	flag = index;
            checkArr = msg;
            
            //将id取出，之后循环判断的时候用id判断是否已经存在数组中，对相应的checkbox进行勾选
            for(var i = 0; i < msg.length; i++){
            	checkedIds = checkedIds + msg[i].id + ",";
            }
            //延迟选中
            setTimeout(function(){
				getChecked();
			},100);
        }
        
        // 检查所有的子选项是否被选中，如果都被选中，则勾选 选中所有 选择框
        function checkOne(obj){
	       	var all=document.getElementById("allSelected");
      	  	if(!obj.checked){
      	    	all.checked = obj.checked; 
      	  	}
      	  	var b = true;
	       	var tagNamesObj=document.getElementsByName("checkbox");
      	  	for(var i=0;i<tagNamesObj.length;i++){
    	     	if(!tagNamesObj[i].checked){
					b=false; 
					break;
		 		}
      	  	}
       	  	all.checked = b;
       	} 
        
	</script>
</body>
</html>
